<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>[[${video.video_title}]]</title>
    <meta charset="utf-8">
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        #MediaPlayer{
            position: absolute;
            top: 100px;
            left: 50%;
            margin-left: -600px;
        }
        .vtit{
            width: 1190px;
            height: 60px;
            padding-left: 10px;
            position: absolute;
            font-family: "微软雅黑";
            font-size: 22px;
            font-weight: bold;
            line-height: 60px;
            left: 50%;
            margin-left: -600px;
            top: 10px;

            overflow:hidden;
            word-break:keep-all;
            white-space:nowrap;
            text-overflow:ellipsis;
        }
        .vtime{
            width: 1200px;
            height: 35px;
            font-family: "微软雅黑";
            font-size: 12px;
            font-weight: bold;
            line-height: 35px;
            position: absolute;
            color: #999;
            left: 50%;
            margin-left: -600px;
            top: 60px;

            overflow:hidden;
            word-break:keep-all;
            white-space:nowrap;
            text-overflow:ellipsis;
        }
        .vtime>.date,.vtime>.hits,.vtime>.time,.vtime>.author{
            position: absolute;
            height: 100%;
        }
        .vtime>.date{
            width: 150px;
            margin-left: 25px;
        }
        .vtime>.hits{
            width: 100px;
            margin-left: 225px;
        }
        .vtime>.time{
            width: 100px;
            margin-left: 375px;
        }
        .vtime>.author{
            width: 200px;
            margin-left: 525px;
        }
    </style>
</head>
<body>

    <div class="vtit" th:text="${video.video_title}"></div>
    <div class="vtime">
        <div class="date">[[${video.release_time}]]</div>
        <div class="hits">[[${video.number_of_hits}]]</div>
        <div class="time">[[${video.video_time}]]</div>
        <div class="author">[[${video.video_author}]]</div>
    </div>

    <object id="MediaPlayer" classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" width="1200" height="600" standby="Loading Windows Media Player components…" type="application/x-oleobject" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112">
        <param name="FileName" th:value="${#httpServletRequest.getScheme() + '://' + #httpServletRequest.getServerName() + ':' + #request.getServerPort()  + #request.getContextPath() + '/file/'}+${video.video_file_path}">
        <param name="AutoStart" value="true">
        <param name="ShowControls" value="true">
        <param name="BufferingTime" value="2">
        <param name="ShowStatusBar" value="true">
        <param name="AutoSize" value="true">
        <param name="InvokeURLs" value="false">
        <param name="AnimationatStart" value="1">
        <param name="TransparentatStart" value="1">
        <param name="Loop" value="1">
        <param name="enableContextMenu" value="false">  <!-- 禁用右击事件 -->
        <embed type="application/x-mplayer2" th:src="${#httpServletRequest.getScheme() + '://' + #httpServletRequest.getServerName() + ':' + #request.getServerPort()  + #request.getContextPath() + '/video/'}+${video.video_file_path}" name="MediaPlayer" autostart="1" showstatusbar="1" showdisplay="1" showcontrols="1" loop="0" videoborder3d="0" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" width="1200" height="600"></embed>
    </object>

    <script type='text/javascript'>
        //禁用右键（防止右键查看源代码）
        window.oncontextmenu=function(){return false;}
        //禁止任何键盘敲击事件（防止F12和shift+ctrl+i调起开发者工具）
        window.onkeydown = window.onkeyup = window.onkeypress = function () {
            window.event.returnValue = false;
            return false;
        }

        // document.getElementById("MediaPlayer").onmousedown = function (event){
        //     if(event.button == 2){
        //         return false;
        //     }
        // }
        // //如果用户在工具栏调起开发者工具，那么判断浏览器的可视高度和可视宽度是否有改变，如有改变则关闭本页面
        // var h = window.innerHeight,w=window.innerWidth;
        // window.onresize = function () {
        //     if (h!= window.innerHeight||w!=window.innerWidth){
        //         window.close();
        //         window.location = "about:blank";
        //     }
        // }
    </script>
</body>
</html>
